<template>
	<view class="popup-com" @click="open">
		<uni-popup ref="popup" background-color="#fff">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				
				<slot></slot>
				<view class="btns-row">
					<view class="close" @click="close">
						关闭
					</view>
					<view class="confirm" @click="confirm">
						确定
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import { EditHelperState } from '../../api/index.js'
	export default {
		name:"PopupCom",
		props:{
			state:{
				type:Number,
				default:0
			},
			// ids:{
			// 	type:Number,
			// 	default:0
			// }
		},
		data() {
			return {
				type: 'center',
			};
		},
		methods:{
			open(){
				this.$refs.popup.open()
			},
			close(){
				this.$emit('close-popup')
				this.$refs.popup.close()
			},
			async confirm(){
				console.log(this.state,'ddd',this.ids)
				// const dataParam = {
				// 	id:this.ids,
				// 	state:this.state
				// }
				// const {data:res} = await EditHelperState(dataParam)
				// console.log(res,'resdata')
				// if(res.status==0){
				// 	this.$emit('update',this.state)
				// }
				this.$emit('confirm-popup')
				this.$refs.popup.close()
			}
		}
	}
</script>

<style lang="scss">
.popup-com{
	width:100%;
	height:100%;
	.popup-content{
		width:600rpx;
		height: 400rpx;
		border-radius: 15rpx;
		position: relative;
		.uni-list{
			
		}
		.btns-row{
			width: 100%;
			height: 80rpx;
			line-height: 80rpx;
			// border: 1px solid #000;
			position: absolute;
			bottom: 0;
			display: flex;
			.close{
				flex: 1;
				text-align: center;
				border: 1px solid #eee;
			}
			.confirm{
				flex: 1;
				text-align: center;
				border: 1px solid #eee;
			}
		}
	}
}
</style>